import { docListTenByCategoryId } from "@/services/knowledgeFile";
import { Modal, Table } from "antd";
import moment from "moment";
import React from "react";
import { formatMessage } from 'umi-plugin-react/locale';

class DocFiles extends React.Component{
  constructor(props){
    super(props);
    this.state = {
      visible:false,
      list:[],
      loading:false
    }
  }

  componentDidMount(){
    if(this.props.onRef){
      this.props.onRef(this)
    }
  }

  initModal = (id) => {
    this.setState({
      visible:true,
      loading:true
    },async () => {
      const res = await docListTenByCategoryId({categoryId:id})
      this.setState({
        list:res,
        loading:false
      })
    })
  }

  onCancel = () => {
    this.setState({
      visible:false,
      list:[],
      loading:false
    })
  }

  render(){
    const { visible,list,loading } = this.state;
    const columns = [
			{
				key: "docTitle",
				align: "left",
				title: formatMessage({ id: 'knowledgeConfig.documentName' }),
				dataIndex: "docTitle",
				width: 200,
			},
			{
				key: "docType",
				align: "left",
				title: formatMessage({ id: 'knowledgeConfig.documentType' }),
				dataIndex: "docType",
				width: 120,
				render: text => {
					let label = '';
					switch (text) {
						case '0':
							label = 'WORD';
							break;

						case '1':
							label = 'EXCEL';
							break;

						case '2':
							label = 'PPT';
							break;

						case '3':
							label = 'PDF';
							break;

						case '4':
							label = 'TXT';
							break;

						case '5':
							label = formatMessage({ id: 'knowledgeConfig.documentMD' });
							break;

						case '6':
							label = 'Markdown';
							break;

						case '7':
							label = '附件';
							break;

						default:
							label = '';
							break;
					};
					return label;
				},
			},
			{
				title: formatMessage({ id: 'knowledgeConfig.documentTime' }),
				dataIndex: 'createTime',
				key: 'createTime',
				width: 150,
				render: (createTime) => {
					if (createTime) {
						return moment(createTime).format('YYYY-MM-DD');
					} else {
						return createTime;
					}
				}
			},
			{
				title: formatMessage({ id: 'knowledgeConfig.documentStatus' }),
				dataIndex: 'docStatus',
				key: 'docStatus',
				width: 120,
				render: docStatus => {
					return docStatus == 1 ? '已停用' : '已启用'
				},
			},
			{
				title: formatMessage({ id: 'knowledgeConfig.documentSyncStatus' }),
				dataIndex: 'syncStatus',
				key: 'syncStatus',
				width: 120,
				render: text => {
					// 同步状态(0: 上传成功/待同步, 1: 上传失败, 2: 同步中, 3: 处理中, 4: 同步成功, 5: 同步失败, 6: 用户取消同步)
					let label = '';
					let color = "#9EA0AA";
					switch (text) {
						case '0':
							label = '待同步';
							break;
						case '1':
							label = '上传失败';
							color = "#E8313B";
							break;
						case '2':
							label = '同步中';
							color = "#3E5BFF";
							break;
						case '3':
							label = '处理中';
							color = "#3E5BFF";
							break;
						case '4':
							label = formatMessage({ id: 'knowledgeConfig.documentDone'});
							color = "#14C6A1";
							break;
						case '5':
							label = formatMessage({ id: 'knowledgeConfig.documentError'});
							color = "#E8313B";
							break;
						case '6':
							label = '用户取消同步';
							break;
						default:
							label = '待同步';
							break;
					};
					return <div><span style={{ borderRadius: "50%", width: 6, height: 6, display: "inline-block", background: color, marginRight: 12, verticalAlign: "middle" }}></span>{label}</div>;
				},
			},
		];

    return (
      <Modal
        visible={visible}
        title={formatMessage({ id: 'knowledgeConfig.seeDocument' })}
        onCancel={this.onCancel}
        footer={false}
        width={800}
        centered
      >
        <Table 
          columns={columns}
          dataSource={list}
          loading={loading}
          rowKey={'id'}
          pagination={false}
          scroll={{x:"auto"}}
        />
      </Modal>
    )
  }
}

export default DocFiles